<template>
	<div id="my">
		<!--<div >编辑</div>
		-->
		<div class="top flex">
			<div class="flex my_top">
				我的
			</div>
			<div class="top_con flex">
				<div class="flex">
					<div class="top_logo">

						<img v-if="tableData.store_logo" :src="tableData.store_logo" />
						<img v-else src="../assets/image/logo.png"/>

					</div>
					<div class="edit flex" @click="skiptoedit">
						<img src="../assets/image/edit.png" /> <span>编辑</span>
					</div>
				</div>
				<div>
					<p>{{tableData.store_address}}</p>
				</div>
				<div class="phone flex">
					<p>{{tableData.store_phone}}</p><img src="../assets/image/phone.png" />
				</div>
				<div class="flex">
					<span>当前评价：</span>
					<el-rate v-model="value" disabled show-score text-color="#FFFFFF" disabled-void-color="#3E474E" :colors="['#FFFFFF', '#FFFFFF', '#FFFFFF']"
						score-template="{value}">
					</el-rate>
				</div>
			</div>
		</div>
		<div class="con">
			<div class="con_center">
				<div class="list flex" @click="skip_my_vip(tableData.store_id)">
					<div class="list_left flex">
						<img src="../assets/image/my_my.png" /> <span>我的会员</span>
					</div>
					<div class="list_right">
						<img src="../assets/image/rc.png" />
					</div>
				</div>
				<div class="list flex" @click="skip_my_shop">
					<div class="list_left flex">
						<img src="../assets/image/yaoqingdainpu.png" /> <span>邀请的店铺</span>
					</div>
					<div class="list_right">
						<img src="../assets/image/rc.png" />
					</div>
				</div>
				<div class="list flex" @click="skip_my_code">
					<div class="list_left flex">
						<img src="../assets/image/wodeyaoqingma.png" /> <span>我的邀请码</span>
					</div>
					<div class="list_right">
						<img src="../assets/image/rc.png" />
					</div>
				</div>
				<div class="list flex" @click="skip_my_evaluate">
					<div class="list_left flex">
						<img src="../assets/image/pingjiaxiangxi.png" /> <span>评价详细</span>
					</div>
					<div class="list_right">
						<img src="../assets/image/rc.png" />
					</div>
				</div>
			</div>
		</div>
		<!--<div class="change">
				<div class="con_center">
			<div class="list flex" @click="skip_set_password">
					<div class="list_left flex">
						<img src="../assets/images/xiugaimima.png"/> <span>修改密码</span>
					</div>
					<div class="list_right">
						<img src="../assets/image/rc.png"/>
					</div>
				</div>
				</div>
		</div>
		
		<div class="tui">
				退出
				
		</div>-->

	</div>
</template>

<script>
	export default {
		name: 'my',
		data() {
			return {
				value:3,
				tableData:'',
			}
		},
		//在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图
		created: function() {},
		methods: {
			back() {
				this.$router.go(-1)
			},
			skiptoedit() {
				this.$router.push({
					path: '/edit'
				});
			},
			skip_my_vip(w) {
				this.$router.push({
					path: '/my_vip',
					query:{
						'store_id':w
					}
				});
			},
			skip_my_shop() {
				this.$router.push({
					path: '/my_shop'
				});
			},
			skip_my_code() {
				this.$router.push({
					path: '/my_code'
				});
			},
			skip_my_evaluate() {
				this.$router.push({
					path: '/my_evaluate'
				});
			},
			skip_set_password() {
				this.$router.push({
					path: '/set_password'
				});
			},
		},
		mounted() {
             var _this = this;
             var qs = require('qs');
             _this.$http.post(_this.baseURL + '/index.php/waveguest/storemy/show_store',qs.stringify({'store_id':localStorage.getItem("store_id"),"key":localStorage.getItem("key")})).then(response => {
             	console.log(response)
             	_this.tableData = response.data.data
				_this.value = response.data.data.store_scores
             }).catch(error => {
             
             });
		}
	}
</script>

<style>
	.el-message {
		min-width: 4rem;
		top: 40% !important;
	}
</style>
<style scoped="scoped">
	.my_top {
		justify-content: center;
		align-items: center;
	}

	.top {
		width: 100%;
		height: 12rem;
		background: #007AFF;
		font-size: 0.65217rem;
		color: white;
		flex-direction: column;
	}

	.top>div:nth-child(1) {
		width: 94%;
		padding-left: 0.3rem;
		height: 2rem;
		line-height: 2rem;
	}

	.top_con {
		flex-direction: column;
		width: 90%;
		margin-left: 5%;
	}

	.top_con>div:nth-child(1) {
		width: 100%;
		justify-content: space-between;
		align-items: center;
	}

	.top_logo {
		width: 2.91304rem;
		height: 2.91304rem;
	}

	.top_logo>img {
		width: 2.91304rem;
		height: 2.91304rem;
		border-radius: 50%;
	}

	.edit {
		width: 3.2826rem;
		height: 1.3261rem;
		border-radius: 0.6739rem;
		border: 1px solid white;
		align-items: center;
		justify-content: center;
	}

	.edit>img {
		width: 0.5rem;
		height: 0.5rem;
		padding-right: 0.3rem;
	}

	.top_con>div:nth-child(2) {
		width: 100%;
		font-size: 0.7391rem;
		padding: 1rem 0;
	}

	.top_con>div:nth-child(3) {
		width: 100%;
		font-size: 0.5217rem;
		padding-bottom: 0.5rem;
		align-items: center;
	}

	.phone>img {
		width: 0.65217rem;
		height: 0.65217rem;
		padding-left: 0.5rem;
	}

	.top_con>div:nth-child(4) {
		width: 100%;
		font-size: 0.4348rem;
		padding-bottom: 0.5rem;
		align-items: center;
	}

	.con {
		width: 94%;
		margin-left: 3%;
		background: white;
		height: 12.6087rem;
		margin-top: -1rem;
		border-radius: 0.4rem;

	}

	.con_center {
		width: 90%;
		margin-left: 5%;
		height: 100%;
	}

	.list {
		justify-content: space-between;
		font-size: 0.65217rem;
		align-items: flex-end;
		height: 2.6rem;

	}

	.list_left {
		align-items: center;
	}

	.list_left>img {
		width: 0.60869rem;
		height: 0.565217rem;
		padding-right: 0.5rem;
	}

	.list_right>img {
		width: 0.31739rem;
		height: 0.6347rem;
	}

	.change {
		width: 94%;
		margin-left: 3%;
		background: white;
		border-radius: 0.4rem;
		margin-top: 0.5rem;
	}

	.change .list {
		justify-content: space-between;
		font-size: 0.65217rem;
		align-items: center;
		height: 2.6rem;

	}

	.tui {
		width: 94%;
		margin-left: 3%;
		background: white;
		border-radius: 0.4rem;
		margin-top: 0.5rem;
		height: 2rem;
		margin-bottom: 2rem;
		text-align: center;
		line-height: 2rem;
		font-size: 0.65217rem;
	}
</style>
